<template>
    <div class="tag-dash-container">
        <div class="head">
            <div class="title">
                <span>方案</span>
            </div>
            <div>
                <el-tag type="primary" effect="dark">效果</el-tag>
            </div>
        </div>

        <div class="body">
            <div class="action-data">
                <div style="text-align: center;">
                    <div style="display: flex; align-items: center;justify-content: center;margin-bottom: 20px;" >
                        <svg-icon a-icon="visit" :a-size="18" />
                        &nbsp;
                        <span style="font-size: 14px">方案</span>
                    </div>
                    <div>
                        <span style="font-size: 14px">{{props.aSchemeAmount}}条</span>
                    </div>
                </div>
                <div style="text-align: center;">
                    <div style="display: flex; align-items: center;justify-content: center;margin-bottom: 20px;" >
                        <svg-icon a-icon="visit" :a-size="18" />
                        &nbsp;
                        <span style="font-size: 14px">收敛BBU</span>
                    </div>
                    <div>
                        <span style="font-size: 14px">{{props.aReturnBbuAmount}}</span>
                    </div>
                </div>
            </div>

          
            
        </div>
    </div>
</template>
<script setup lang="ts">
import LiquidDash from "@/components/liquid_dash/liquid_dash_index.vue";
import SvgIcon from "@/components/svg_icon/svg_icon_index.vue";
import { ref } from "vue";
const props = defineProps({
    aSchemeAmount: {
        type: Number,
        required: true,
    },
    aReturnBbuAmount: {
        type: Number,
        required: true,
    },
});

////#region defineXxx
//defineOptions({
//name:
//});

//const props=defineProps({
//propA:{
//type:String,
//required:true
//},
//propB:{
//type:Number,
//default:1
//},
//propC:{
//type:String as PropType<MyType>,
//required:true
//},
//});

//const emit = defineEmits<{
//event1:[para1:number,para2:string],
//event2:[para1:number,para2:string],
//}>();
////#endregion
</script>
<style lang="scss" scoped>
.tag-dash-container {
    background-image: linear-gradient(90deg, #edf5ff 0, #f1fcff 100%);
    box-shadow: 0 4px 8px 0 rgba(7, 75, 156, 0.2);
    border-radius: 15px;
    padding: 10px 10px;
    height: 100%;
}
.head {
    height: 54px;
    border-bottom: 1px solid #e8e8e8;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.title {
    font-weight: 700;
    font-size: 16px;
    // border-left: 3px solid #e02626;
    padding-left: 3px;
    vertical-align: middle;
    display: flex;
    align-items: center;
    position: relative;
}

.title span {
    height: 16px;
    line-height: 16px;
    margin-left: 5px;
}

.title::before {
    content: "";
    display: inline-block;
    width: 3px;
    height: 16px;
    line-height: 16px;
    background: #fb6602;
}
.body {
    // display: flex;
    padding: 5px 0;
    // align-items: center;
    // justify-content: space-between;
    .summary {
        display: block;
        font-size: 13px;
        span {
            font-size: 16px;
            font-weight: 600;
        }
    }
    .action-data {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 20px;
        padding: 0;
    }
}
.liquid {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
</style>
